<script>
export default {
  name: "myinfo",
  data() {
    return {
      form: {
        password: '',
        password2: '',
      },
    }
  },
  methods: {
    submit() {
      // 必须要存在
      if (!this.form.password) {
        uni.showToast({
          title: '请输入密码',
          icon: 'none',
          duration: 2000
        })
        return
      }
      if (!this.form.password2) {
        uni.showToast({
          title: '请输入确认密码',
          icon: 'none',
          duration: 2000
        })
        return
      }
      if (this.form.password !== this.form.password2) {
        uni.showToast({
          title: '两次密码不一致',
          icon: 'none',
          duration: 2000
        })
        return
      }
      this.$api.memberUpdate({
        id: uni.getStorageSync('memberId'),
        password: this.form.password
      }).then(() => {
        uni.showToast({
          title: '更新成功',
          icon: 'success',
          duration: 2000
        })
      })
    }
  }
}
</script>

<template>
  <div class="myinfo">
    <div class="form-box">
      <u-form :model="form" ref="uForm" label-width="120px">
        <u-form-item label="密码" label-width="120px"><u-input v-model="form.password" type="password"/></u-form-item>
        <u-form-item label="再次输入密码" label-width="120px"><u-input v-model="form.password2" type="password"/></u-form-item>
      </u-form>
    </div>
    <u-button type="primary" style="margin-top: 20rpx" @click="submit" >保存</u-button>
  </div>
</template>

<style lang="scss">
.myinfo {
  height: 100%;
  background-color: #F5F7FA;
  padding: 20rpx;
  .form-box {
    border-radius: 10px;
    background-color: #FFFFFF;
    padding: 20rpx;
  }
}
</style>